<template>
  <div class="pk-scoreRecord">
    <el-drawer v-model="drawer" :title="title" @close="onClose" size="500px">
      <pk-table :tableConfig="tableConfig" :data="detailData" @onSize="onSize" :total="total" :isPage="false">
        <template #index="scope">
          <div v-if="scope.index <=2" class="task-detail-topative"></div>
          <div v-else class="task-detail-topdefault">{{ scope.index + 1 }}</div>
        </template>
        <template #username="{row}">
          <div>{{row?.judges?.username}}</div>
        </template>
        <template #score="{row}">
          <div @click="setUser(row)">{{ row.score }}</div>
        </template>
      </pk-table>
    </el-drawer>
  </div>
</template>
<script setup>
  import { ref, defineProps, onMounted, defineEmits } from 'vue'
  import { taskGetUserMarkScoreRecord } from '@/api/api'
  import pkTable from '@/components/pkui/pk-table/pk-table.vue'
  import { useRoute } from 'vue-router'
  const drawer = ref(true)
  const detailData = ref([])
  const route = useRoute()
  const emit = defineEmits(['onClose'])
  const props = defineProps({
    title: {
      type:String,
      default:'打分记录'
    },
    curData: {
      type: [String, Number],
      default:''
    }
  })

  const tableConfig = ref([
    {
      label: '评委名称',
      type: 'slot',
      slotName: 'username',
      prop: 'userDutiesName',
    },
    {
      label: '组名',
      prop: 'userDutiesName'
    },
    {
      label: '权重',
      prop: 'ratio',
    },
    {
      label: '选项',
      prop: 'optionsName',
    },
    {
      label: '分数',
      prop: 'scoreNum',
    }
  ])

  const getDetail = () => {
    const { id } = route.query
    taskGetUserMarkScoreRecord({
      taskId: id,
      id: props.curData.userInfo.id
    }).then(res => {
      detailData.value = res.resData
    })
  }

  const onClose = () => {
    emit('onClose')
  }

  onMounted(() => {
    getDetail()
  })
</script>
<style lang="scss">
.pk-scoreRecord{
  &-info{

  }
}
</style>